<template>
  <div style="padding: 20px">
    <el-form :label-position="labelPosition" :rules="rules" label-width="22%" :model="formLabelAlign">
      <br/>
      <div class="text">添加新用户</div>
      <br/>
      <el-form-item label="用户昵称">
        <el-input v-model="formLabelAlign.username"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="formLabelAlign.password"></el-input>
      </el-form-item>
      <el-form-item label="账户名" prop="account">
        <el-input v-model="formLabelAlign.account"></el-input>
      </el-form-item>
<!--      <el-form-item label="生日">-->
<!--        <el-input v-model="formLabelAlign.birthday"></el-input>-->
<!--      </el-form-item>-->
      <el-form-item label="生日">
        <el-col :span="11">
          <el-date-picker type="date" placeholder="Pick a date" v-model="formLabelAlign.birthday" style="width: 100%;"></el-date-picker>
        </el-col>
      </el-form-item>
      <el-form-item label="性别">
<!--        <el-radio v-model="radio1" label="1" border>备选项1</el-radio>-->
<!--        <el-radio v-model="radio1" label="2" border>备选项2</el-radio>-->
<!--        <el-input v-model="formLabelAlign.sex"></el-input>-->
        <el-select v-model="formLabelAlign.sex">
          <el-option label="男" value="1"></el-option>
          <el-option label="女" value="2"></el-option>
          <el-option label="保密" value="3"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="身份">
        <el-select v-model="formLabelAlign.authority">
          <el-option label="管理员" value="1"></el-option>
          <el-option label="普通用户" value="99"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <router-link :to="{path:'/user/userlist'}">
        <el-button type="primary"  @click="upload">添加</el-button>
        <el-button >取消</el-button>
        </router-link>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  import qs from 'qs'
  export default {
    data() {
      return {
        labelPosition: 'left',
        formLabelAlign: {
        },
        rules:{
          account:[{require: true}]
        }
      };
    },
    methods:{
      upload: function() {
        let adduser={
          username: this.formLabelAlign.username,
          password: this.formLabelAlign.password,
          account: this.formLabelAlign.account,
          birthday:this.formLabelAlign.birthday,
          sex:this.formLabelAlign.sex,
          authority:this.formLabelAlign.authority,
        }
        this.$axios({
          headers:{
            "Content-Type": "application/json"
          },
          method:"post",
          url:"http://localhost:8080/api/user/adduser",
          data:{
            username:adduser.username,
            password: adduser.password,
            account: adduser.account,
            birthday: adduser.birthday,
            sex: adduser.sex,
            authority: adduser.authority
          }
        }).then((res)=>{
          if(res.data.resultCode==="0"){
            this.$message({
              message: '添加成功',
              type: 'success'
            });
          }
        })
      }
    }
  }
</script>

<style scoped>
  .text {
    font-size: 30px;
    line-height: 46px;
    text-align: center;
  }
</style>

